<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>在线用户管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/systemStatic/style/admin.css">
    <link rel="stylesheet" href="${ctx}/extends/zTree_v3/css/zTreeStyle/zTreeStyle.css"/>
    <link rel="stylesheet" href="${ctx}/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/css/public.css">
    <style>
        .layui-table-tool-temp{padding-right: 0}
    </style>
    <script type="text/javascript">
        var __ctx = "${ctx}";
    </script>
</head>
<body>
    <div style="position: relative;height: 100%;" >
        <div class="ccpui-trees">
                <p class="isShowTree colorSwitch">
                    <span style="float: left;color: #fff">&nbsp;&nbsp;组织机构管理</span>
                    <i layadmin-event="treeFlexible" class="layui-icon layui-icon-prev"></i>
                </p>
                <div style="margin-top: 6px;">
                    <ul class="ccpui-iconTree iconTrees">
                        <li><a class="iconfont iconshuaxin- zTree-refresh" title="刷新"></a></li>
                        <li><a class="iconfont iconwenjianjia1-copy zTree-triangle-d" title="展开"></a></li>
                        <li><a class="iconfont iconfolder1 zTree-triangle-r" title="收起"></a></li>
                            <input type="text"  style="width: 50%" class="orgZtreeValue">
                    </ul>
                    <ul id="treeSelectUsers" class="ztree ccpui-listZtree"></ul>
                </div>
        </div>
    <!--初表-->
        <div class="ccpui-coreContent">
            <table id="userListTable" lay-filter="userListTable"></table>
        </div>
    </div>
    <!--给用户分配组织-->
    <div hidden name="configOrgDiv" style="display: none">
        <ul class="ccpui-iconTree orgSelectBtn">
            <li><a class="iconfont iconshuaxin- zTree-refresh" title="刷新"></a></li>
            <li><a class="iconfont iconwenjianjia1-copy zTree-triangle-d" title="展开"></a></li>
            <li><a class="iconfont iconfolder1 zTree-triangle-r" title="收起"></a></li>
            <input type="text"  style="width: 128px" class="orgZtreeValues">
        </ul>
        <ul id="configOrgData" class="ztree" style="height: 450px;overflow: auto"></ul>
        <div style="text-align: center;margin-bottom: 14px">
            <button class="layui-btn saveOrg">保存</button>
            <button class="layui-btn layui-btn-danger cancelOrg">取消</button>
        </div>
    </div>
    <!-- 用户信息列表头部工具栏 -->

    <script type="text/html" id="headerToolsBar">
        <div class="ccpui-enterSel">
        <div class="layui-btn-container">
            <a class="layui-btn layui-btn-sm" lay-event="query">
                <i class="layui-icon">&#xe615;</i>
                <span>查询</span>
            </a>
            <a class="layui-btn layui-btn-sm" lay-event="clears">
                <i class="layui-icon">&#xe9aa;</i>
                <span>重置</span>
            </a>
<!--            <a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="offline">-->
<!--                <i class="layui-icon ">&#xe640;</i>-->
<!--                <span>强制下线</span>-->
<!--            </a>-->
        </div>
        <form class="layui-form" action="" lay-filter="example" style="margin-top:10px">
            <div class="table-top-filter">
                <div class="table-filter-alone">
                    <label class="layui-form-label">姓名</label>
                    <input type="text" class="layui-input filter-value" name="Q_fullName_SL" placeholder="姓名"/>
                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">账号</label>
                    <input type="text" class="layui-input filter-value" name="Q_account_SL" placeholder="账号"/>
                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">账户状态</label>
                    <select class="queryLocking filter-value" name="isNormal">
                        <option value="">-----请选择----</option>
                        <option value="0">账户无异常</option>
                        <option value="1">账户已禁用</option>
                        <option value="2">账户已删除</option>
                        <option value="3">账户已过期</option>
                        <option value="4">账户已锁定</option>
                    </select>
                </div>
                <span class="_cjr"></span>
                <div class="table-filter-alone">
                    <label class="layui-form-label">创建时间</label>
                    <input type="text" name="Q_beginCreateTime_DL" autocomplete="off" placeholder="开始时间" class="layui-input start_time filter-value">

                </div>
                <div class="table-filter-alone">
                    <label class="layui-form-label">——</label>
                    <input type="text" name="Q_endCreateTime_DG" autocomplete="off" placeholder="结束时间" class="layui-input end_time filter-value">

                </div>

            </div>
        </form>
        </div>
    </script>
    <#-- 右侧工具栏 来源list页面-->
    <script type="text/html" id="userRightToolsBar">
            <a class="layui-btn layui-btn-xs" lay-event="detail">明细</a>
            {{# if(d.isCurrent != 1){ }}
            <button class="layui-btn layui-btn-danger layui-btn-xs isOnline" lay-event="setOffline" >置为离线</button>
            {{# } }}
    </script>
    <div>
    </div>
    <script src="${ctx}/layui/layui.js"></script>
    <script src="${ctx}/extends/jquery.min.js" type="text/javascript"></script>
    <script src="${ctx}/public/component.js" type="text/javascript"></script>
    <script src="${ctx}/extends/zTree_v3/js/jquery.ztree.all.min.js" type="text/javascript"></script>
    <script src="${ctx}/extends/zTree_v3/js/jquery.ztree.exhide.min.js" type="text/javascript"></script>
    <script>
        layui.config({
            base: serverPath.systemPath + staticPath.systemPath //静态资源所在路径
        }).extend({
            index: 'index' //主入口模块
        }).use(['index','table', 'layer', 'form', 'laydate', 'totalFilter', 'setter','upload','commons','common'], function() {
                var table = layui.table;
                var layer = layui.layer,totalFilter = layui.totalFilter,form = layui.form,$ = layui.jquery,setter = layui.setter,upload=layui.upload,commons=layui.commons,common=layui.common;
                //选中的左侧角色树的节点ID
                var selectOrgId = "";
                //树状结构
                orgZtree();
            if(screen.width<=1366){
                $("._cjr").html("<br>")
            }
                function orgZtree(){
                    $.ajax({
                        url: serverPath.systemPath + setter.sysLinkPath + "sysOrg/list",
                        type: "get",
                        contentType: 'application/json',
                        dataType: 'json',
                        success: function(data) {
                            var zNodes = data.data;
                            var setting = {
                                view: {
                                    showLine: false,
                                    nameIsHTML: true, //允许name支持html
                                    selectedMulti: false
                                },
                                edit: {
                                    enable: false,
                                    editNameSelectAll: false
                                },
                                data: {
                                    simpleData: {
                                        enable: true,
                                        idKey:"orgId",
                                        pIdKey:"orgSupId"
                                    }
                                },
                                callback: {
                                    onClick: onClickUsers
                                }
                            };
                            $.fn.zTree.init($('#treeSelectUsers'), setting, zNodes);
                            component.fuzzySearch('treeSelectUsers','.orgZtreeValue',null,true); //初始化模糊搜索方法
                        },
                    });
                }

                function hideRMenu() {
                    if ($("#orgRightMenu")) $("#orgRightMenu").css({"visibility": "hidden"});
                    $("body").unbind("mousedown", onBodyMouseDown);
                }
                function onBodyMouseDown(event){
                    if (!(event.target.id == "orgRightMenu" || $(event.target).parents("#orgRightMenu").length>0)) {
                        $("#orgRightMenu").css({"visibility" : "hidden"});
                    }
                }

                function onClickUsers(event, treeId, treeNode, clickFlag) {
                    selectOrgId = treeNode.orgId;
                    common.tableConditionRender("userListTable","example",{where:{"orgId":treeNode.orgId}},true);
                    commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                }

                //展开
                $(".iconTrees .zTree-triangle-d").click(function() {
                    $.fn.zTree.getZTreeObj("treeSelectUsers").expandAll(true);
                });
                //收起
                $(".iconTrees .zTree-triangle-r").click(function() {
                    $.fn.zTree.getZTreeObj("treeSelectUsers").expandAll(false);
                });
                //刷新
                $(".iconTrees .zTree-refresh").click(function() {
                    orgZtree();
                });

            var tableHeight = commons.tabHeight();


                tableHeight='full-60';

            window.onresize = function(){

                    $(".layui-table-main").css("height",$(".layui-table-main").outerHeight()+50+'px')

            }
                //初表
                table.render({
                    elem: '#userListTable',
                    cellMinWidth: 80,
                    title: '用户信息列表',
                    height: tableHeight,
                    url: serverPath.systemPath + setter.sysLinkPath + 'sysUser/queryUserListByIsOnline', //数据接口
                    page: true, //开启分页
                    method: 'get',
                    defaultToolbar: ['filter', 'print'],
                    toolbar: '#headerToolsBar',
                    autoSort: false,//禁用前端排序
                    // even: true,//各行变色
                    cols: [
                        [
                            {type: 'checkbox'},
                            {field: 'userId', title: 'ID', sort: true, hide: true},
                            {field: 'fullName',align:'center', title: '姓名', sort: true},
                            {field: 'account',align:'center',title: '账号', sort: true},
                            {field: 'createTime',align:'center',title: '创建时间', templet: function(d) {return component.timeData(d.createTime);}, sort: true},
                            {
                                field: 'status', title: '状态',width:100,align:'center', sort: true, templet: function (d) {
                                    function queryFormToStatus(_formStatus, _status) {
                                        if(_status == "" || _status == _formStatus){
                                            return "";
                                        }else{
                                            switch(_status){
                                                case "1":  return "或已禁用";
                                                case "2":  return "或已删除";
                                                case "3":  return "或已过期";
                                                case "4":  return "或已锁定";
                                            }
                                        }
                                    }
                                    var _status = $(".queryLocking").val();

                                    if (d.status != '1') {
                                        if(_status==2){ _status=1;}
                                        return '账户已禁用或已删除'+queryFormToStatus(1,_status);
                                    }else if (d.isExpired != 0) {
                                        return '账号已过期'+queryFormToStatus(3,_status);
                                    }else if (d.isLock != 0)    {
                                        return '账号已锁定'+queryFormToStatus(4,_status);
                                    }else{
                                        return '账户无异常';
                                    }
                                }
                            },
                            {field: 'currIp', title: '登录IP',align:'center', sort: true},
                            {field: 'fromType',align:'center',title: '数据来源', sort: true, templet: function(d) {
                                    if (d.fromType == '0') {
                                        return '系统添加';
                                    }
                                    if (d.fromType == '1') {
                                        return 'AD同步';
                                    }
                                    if (d.fromType == '2') {
                                        return 'AD同步';
                                    }
                                    return '';
                                }
                            }, {align: 'center', title: '管理', toolbar: '#userRightToolsBar'}
                        ]
                    ],
                    done:function () {
                        common.tableSelectCon('.ccpui-enterSel .layui-form input','a[lay-event=query]','.ccpui-enterSel')
                    }
                });
                totalFilter.init('userListTable');

                //监听用户信息列表头部工具栏事件
                table.on('toolbar(userListTable)', function(obj) {
                    var checkStatus = table.checkStatus(obj.config.id);
                    var data = checkStatus.data;
                    switch (obj.event) {
                        /*case 'offline':
                            //TODO 强制下线按钮功能带实现
                            // common.tableConditionRender("userListTable","example",{where:{"orgId":selectOrgId}},false);
                            // commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                            break;*/
                        case 'query':
                            common.tableConditionRender("userListTable","example",{where:{"orgId":selectOrgId}},false);
                            commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                            break;
                        case 'clears':
                            common.tableConditionRender("userListTable","example",{where:{"orgId":selectOrgId}},true);
                            commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                            break;
                    }
                });

            var orgIdsels;

                //监听行工具事件
                table.on('tool(userListTable)', function(obj) {
                    var data = obj.data, //获得当前行数据
                        layEvent = obj.event; //获得 lay-event 对应的值
                    switch(layEvent){
                        case 'detail':
                            layer.open({
                                type: 2,
                                area: ['1000px', '620px'],
                                title: ['查看用户信息'],
                                content: serverPath.systemPath +setter.sysLinkPath + 'sysUser/view/view?userId='+data.userId
                            });
                            break;
                        case 'setOffline':
                            var currentElement=$(this);
                            layer.confirm('确定将此用户置为离线吗？', function(index) {
                                $.ajax({
                                    url: serverPath.systemPath + setter.sysLinkPath + "sysUser/setOffline",
                                    type: "post",
                                    dataType: 'json',
                                    data: {userId: obj.data.userId},
                                    success: function (data) {
                                        if (commons._filterRecord(data)) {
                                            layer.alert(data.msg);
                                            table.reload('userListTable');
                                        } else {
                                            layer.alert(data.msg);
                                        }
                                    },
                                });
                            });
                            break;
                        case 'editUserOrg':
                            var userOrgIndex = layer.open({
                                type: 1,
                                title: '选择用户所属组织',
                                shadeClose: false,
                                shade: 0.001,
                                maxmin: false, //开启最大化最小化按钮
                                area: ['400px', '584px'],
                                content: $('[name="configOrgDiv"]'),
                                success:function(layor,index) {
                                    userOrgZtree();
                                }
                            });

                            //展开
                            $(".orgSelectBtn .zTree-triangle-d").click(function() {
                                $.fn.zTree.getZTreeObj("configOrgData").expandAll(true);
                            });
                            //收起
                            $(".orgSelectBtn .zTree-triangle-r").click(function() {
                                $.fn.zTree.getZTreeObj("configOrgData").expandAll(false);
                            });
                            //刷新
                            $(".orgSelectBtn .zTree-refresh").click(function() {
                                userOrgZtree();
                            });

                            $('[name=configOrgDiv] .saveOrg').unbind("click");
                            $('[name=configOrgDiv] .saveOrg').bind('click',function () {
                                if(orgIdsels){
                                    $.ajax({
                                        url: serverPath.systemPath + setter.sysLinkPath + "sysUser/changeOrg",
                                        type: "post",
                                        dataType: 'json',
                                        data:{
                                            userId:data.userId,
                                            orgId:orgIdsels
                                        },
                                        success: function(data) {
                                            if (commons._filterRecord(data)) {
                                                layer.alert(data.msg, function (index) {
                                                    layer.close(index);
                                                    layer.close(userOrgIndex);
                                                    table.reload('userListTable', {
                                                        where:{"orgId":selectOrgId},
                                                        page: {curr: 1, limit: 10}
                                                    });
                                                    totalFilter.init('userListTable');
                                                    commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                                                });
                                            } else {
                                                layer.alert(data.msg);
                                            }
                                        },
                                        error: function(XMLHttpRequest, textStatus, errorThrown) {
                                            layer.alert("保存失败！" + XMLHttpRequest.status);
                                        },
                                    })
                                }else{
                                    layer.alert("未选择组织!");
                                    return false;
                                }
                            })
                            $('[name=configOrgDiv] .cancelOrg').unbind("click");
                            $('[name=configOrgDiv] .cancelOrg').bind('click',function () {
                                layer.close(userOrgIndex);
                            });
                            break;
                    }
                });

            function onClickUserData(event, treeId, treeNode, clickFlag) {
                orgIdsels = treeNode.orgId;
            }

            function userOrgZtree(){
                $.ajax({
                    url: serverPath.systemPath + setter.sysLinkPath + "sysOrg/list",
                    type: "get",
                    contentType: 'application/json',
                    dataType: 'json',
                    success: function(data) {
                        var zNodes = data.data;
                        var setting = {
                            view:{
                                nameIsHTML: true
                            },
                            data: {
                                simpleData: {
                                    enable: true,
                                    idKey:"orgId",
                                    pIdKey:"orgSupId"
                                }
                            },
                            callback: {
                                onClick: onClickUserData
                            }
                        };
                        $.fn.zTree.init($('#configOrgData'), setting, zNodes);
                        component.fuzzySearch('configOrgData','.orgZtreeValues',null,true); //初始化模糊搜索方法
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        layer.alert("暂无数据，请稍后操作！" + XMLHttpRequest.status);
                    },
                })
            }

                //监听删除
                window.Initialization = function () {
                    commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                };
                /*刷新时间控件*/
                commons.reflashDate({startName:'.start_time',endName:'.end_time'});
                common.tableSort("userListTable",{show:window.Initialization});
            });
    </script>
</body>
</html>
<link rel="stylesheet" href="${ctx}/css/font/iconfontie.css" media="all"/>
<link rel="stylesheet" href="${ctx}/iconfont/iconfont.css"/>


